import Vue from 'vue'

import Cookies from 'js-cookie'

import 'normalize.css/normalize.css' // a modern alternative to CSS resets

import Element from 'element-ui'
import './styles/element-variables.scss'

import '@/styles/index.scss' // global css
import '@/assets/css/qloud-style.css' // global css
import '@/assets/css/bootstrap.min.css' // global css
import '@/assets/css/qloud-style.css' // global css
import '@/assets/js/jquery-min.js'
// import '@/assets/js/bootstrap.min.js'
// import '@/assets/js/custom.js'
import '@/assets/js/echarts.min.js'

import App from './App'
import router from './router'
import { uploadPath, downPath } from '@/api/storage'

import './icons' // icon
import './permission' // permission control
import './utils/error-log' // error log

import permission from './directive/permission'

import * as filters from './filters' // global filters
import moment from 'moment'
import Swiper from 'swiper'
import '@/assets/js/swiper.css' // swiper css
import '@/assets/js/swiper.min.js' // swiper js
import '@/assets/js/swiper-bundle.min.css' // swiper css
import '@/assets/js/swiper-bundle.min.js' // swiper js
Vue.prototype.$uploadPath = uploadPath
Vue.prototype.$downPath = downPath
// 引⼊ECharts
import echarts from 'echarts'
Vue.prototype.$echarts = echarts
// 中文简体
moment.locale('zh-cn')

Vue.use(permission)

Vue.filter('dateFormat', (dataStr, pattern = 'YYYY-MM-DD HH:mm:ss') => {
  return moment(dataStr).format(pattern)
})

Vue.use(Element, {
  size: Cookies.get('size') || 'medium' // set element-ui default size
})

// register global utility filters
Object.keys(filters).forEach(key => {
  Vue.filter(key, filters[key])
})

Vue.prototype.msg = function (msg) {
  this.$message({ showClose: true, message: msg, type: 'success', duration: 1000 })
}

Vue.prototype.error = function (msg) {
  this.$message({ showClose: true, message: msg, type: 'error' })
}

Vue.prototype.errorHtml = function (msg) {
  this.$message({ showClose: true, message: msg, type: 'error', dangerouslyUseHTMLString: true })
}

Vue.prototype.info = function (msg) {
  this.$message.info(msg)
}

Vue.config.productionTip = false

import Vuebar from 'vuebar'
import 'nprogress/nprogress.css'

Vue.use(Vuebar)

var axios = require('axios')
// 全局注册，之后可在其他组件中通过 this.$axios 发送数据
Vue.prototype.$axios = axios
import Vuex from 'vuex'

Vue.use(Vuex)
//全局变量
var store = new Vuex.Store({
  state: {
    token: '',
    id: '',
    name: '',
    avatar: '',
    role: ''
  },
})
new Vue({
  el: '#app',
  router,
  store,
  render: h => h(App),
  components: { App },
  template: '<App/>'
})

// 图片预览
import Viewer from 'v-viewer'
import 'viewerjs/dist/viewer.css'
Vue.use(Viewer)
Viewer.setDefaults({
  Options: { 'inline': true, 'button': true, 'navbar': true, 'title': true, 'toolbar': true, 'tooltip': true, 'movable': true, 'zoomable': true, 'rotatable': true, 'scalable': true, 'transition': true, 'fullscreen': true, 'keyboard': true, 'url': 'data-source' }
})

import VueLazyload from 'vue-lazyload' // 引入这个懒加载插件
Vue.use(VueLazyload, {
  error: require('@/styles/images/defaultImg.jpg'),
  attempt: 1
})

// 富文本图片解析
Vue.prototype.formatStrHtmLetter = function (htmlStr) {
  const htmlDoc = new DOMParser().parseFromString(htmlStr, 'text/html')
  const tags = htmlDoc.getElementsByTagName('img')
  if (tags && tags.length > 0) {
    for (let i = 0; i < tags.length; i++) {
      if (tags[i].getAttribute('src') && tags[i].getAttribute('src').indexOf('http') === -1) {
        htmlDoc.getElementsByTagName('img')[i].src = downPath + tags[i].getAttribute('src')
      }
    }
  }
  return htmlDoc.body.innerHTML
}
